<template>
  <!-- <el-button :size="size" :type="type" :icon="icon" :disabled="disabled"
    :loading="loading" v-show="hasPerms(perms)" @click="handleClick">
    {{label}}
  </el-button>-->
  <div v-show="hasPerms(perms)">
    <el-form
      :model="dataForm"
      label-width="120px"
      :rules="dataFormRules"
      ref="dataForm"
      :size="size"
    >
      <!-- <el-form-item label="名称" prop="name">
            <el-select v-model="dataForm.name"  placeholder="请选择等级名称" style="width:100%;" auto-complete="off">
                <el-option label="请选择需求分类" value=""></el-option>
            </el-select>
      </el-form-item>-->
      <el-row style="display:flex;" class="search-input">
        <el-form-item label="商家信息：">
          <el-input
            style="width:200px;"
            v-model="dataForm.merchantName"
            auto-complete="off"
            disabled
            type="text"
            :placeholder="dataForm.merchantName"
          ></el-input>
        </el-form-item>
                <el-form-item label="供应商编码：" prop="supplierMnemonicCode" required>
          <el-input
            style="width:200px;"
            v-model="dataForm.supplierMnemonicCode"
            auto-complete="off"
            type="text"
            placeholder="供应商编码"
            :disabled="isView == '1'"
          ></el-input>
        </el-form-item>
        <el-form-item label="供应商名称：" prop="supplierName" required>
          <el-input
            style="width:200px;"
            v-model="dataForm.supplierName"
            auto-complete="off"
            type="text"
            placeholder="供应商名称"
            :disabled="isView == '1'"
          ></el-input>
        </el-form-item>
        <el-form-item label="供应商简称：" prop="supplierAbbreviation">
          <el-input
            style="width:200px;"
            v-model="dataForm.supplierAbbreviation"
            auto-complete="off"
            type="text"
            placeholder="供应商简称"
            :disabled="isView == '1'"
          ></el-input>
        </el-form-item>
      </el-row>
      <el-tabs :tab-position="tabPosition" type="border-card" style="height: auto;">
        <el-tab-pane label="基本信息">
          <el-row style="display:flex;" class="searchDialog-input">
            <el-form-item label="供应商助记码：" prop="supplierMnemonicCode">
              <el-input
                style="width:400px;"
                v-model="dataForm.supplierMnemonicCode"
                auto-complete="off"
                type="text"
                placeholder="供应商助记码"
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
            <el-form-item label="供应商GLN码：" prop="supplierGlnCode">
              <el-input
                style="width:400px;"
                v-model="dataForm.supplierGlnCode"
                auto-complete="off"
                type="text"
                placeholder="供应商GLN码"
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
          </el-row>
          <el-row style="display:flex;" class="searchDialog-input">
            <el-form-item label="企业类型：" prop="enterpriseType" required>
              <el-select
                v-model="dataForm.enterpriseType"
                placeholder="请选择企业类型"
                style="width:400px;"
                auto-complete="off"
                :disabled="isView == '1'"
              >
                <el-option label="国有企业" value="1"></el-option>
                <el-option label="集体企业" value="2"></el-option>
                <el-option label="股份制企业" value="3"></el-option>
                <el-option label="中外合资企业" value="4"></el-option>
                <el-option label="民营企业" value="5"></el-option>
                <el-option label="外商独资企业" value="6"></el-option>
                <el-option label="其他" value="7"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="公司邮箱：" prop="companyEmail">
              <el-input
                style="width:400px;"
                v-model="dataForm.companyEmail"
                auto-complete="off"
                type="text"
                placeholder="公司邮箱"
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
          </el-row>
          <el-row style="display:flex;" class="searchDialog-input">
            <el-form-item label="公司网址：" prop="companyWebsite">
              <el-input
                style="width:400px;"
                v-model="dataForm.companyWebsite"
                auto-complete="off"
                type="text"
                placeholder="公司网址"
                :disabled="isView == '1'"
              >
                <template slot="prepend">Http://</template>
              </el-input>
            </el-form-item>
            <el-form-item label="联系电话：" prop="contactNumber">
              <el-input
                style="width:400px;"
                v-model="dataForm.contactNumber"
                auto-complete="off"
                type="text"
                placeholder="联系电话"
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
          </el-row>
          <el-row style="display:flex;" class="searchDialog-input">
            <el-form-item label="传真号码：" prop="faxNumber">
              <el-input
                style="width:400px;"
                v-model="dataForm.faxNumber"
                auto-complete="off"
                type="text"
                placeholder="传真号码"
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
            <el-form-item label="企业品牌名称：" prop="enterpriseBrandName">
              <el-input
                style="width:400px;"
                v-model="dataForm.enterpriseBrandName"
                auto-complete="off"
                type="text"
                placeholder="企业品牌名称"
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
          </el-row>
          <el-row style="display:flex;" class="searchDialog-input">
            <el-form-item label="内部供应商：" prop="internalSupplier">
              <el-input
                style="width:400px;"
                v-model="dataForm.internalSupplier"
                auto-complete="off"
                type="text"
                placeholder="内部供应商"
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
            <el-form-item label="交易币别：" prop="transactionCurrency">
              <el-select
                v-model="dataForm.transactionCurrency"
                placeholder="请选择交易币别"
                style="width:400px;"
                auto-complete="off"
                :disabled="isView == '1'"
              >
                <el-option label="CNY" value="1"></el-option>
                <el-option label="AUD" value="2"></el-option>
                <el-option label="USD" value="3"></el-option>
                <el-option label="GBP" value="4"></el-option>
              </el-select>
            </el-form-item>
          </el-row>
          <el-row style="display:flex;" class="searchDialog-input">
            <el-form-item label="采购方式：" prop="purchasingMethod" required>
              <el-select
                v-model="dataForm.purchasingMethod"
                placeholder="请选择采购方式"
                style="width:400px;"
                auto-complete="off"
                :disabled="isView == '1'"
              >
                <el-option label="普通采购" value="0"></el-option>
                <el-option label="集团采购" value="1"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="合作方式：" prop="cooperationMethod">
              <el-select
                v-model="dataForm.cooperationMethod"
                placeholder="请选择合作方式"
                style="width:400px;"
                auto-complete="off"
                :disabled="isView == '1'"
              >
                <el-option label="经销" value="1"></el-option>
                <el-option label="代销" value="2"></el-option>
              </el-select>
            </el-form-item>
          </el-row>
          <el-row style="display:flex;" class="searchDialog-input">
            <el-form-item label="备注：" prop="remarks">
              <el-input
                style="width:400px;"
                v-model="dataForm.remarks"
                auto-complete="off"
                type="textarea"
                placeholder="备注"
                maxlength="50"
                show-word-limit
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
            <el-form-item label="状态：" prop="status">
              <el-radio v-model="dataForm.status" label="1" :disabled="isView == '1'">启用</el-radio>
              <el-radio v-model="dataForm.status" label="2" :disabled="isView == '1'">关闭</el-radio>
            </el-form-item>
          </el-row>
        </el-tab-pane>
        <el-tab-pane label="营业执照信息">
          <el-row style="display:flex;" class="searchDialog-input">
            <el-form-item label="公司名称：" prop="companyName">
              <el-input
                style="width:400px;"
                v-model="businessLicenseInfo.companyName"
                auto-complete="off"
                type="text"
                placeholder="公司名称"
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
            <el-form-item label="企业税号：" prop="corporateTaxNumber">
              <el-input
                style="width:400px;"
                v-model="businessLicenseInfo.corporateTaxNumber"
                auto-complete="off"
                type="text"
                placeholder="企业税号"
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
          </el-row>
          <el-row style="display:flex;" class="searchDialog-input">
            <el-form-item label="法定代表人：" prop="legalRepresentative">
              <el-input
                style="width:400px;"
                v-model="businessLicenseInfo.legalRepresentative"
                auto-complete="off"
                type="text"
                placeholder="法定代表人"
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
            <el-form-item label="营业执照号码：" prop="businessLicenseNumber">
              <el-input
                style="width:400px;"
                v-model="businessLicenseInfo.businessLicenseNumber"
                auto-complete="off"
                type="text"
                placeholder="营业执照号码"
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
          </el-row>
          <el-row style="display:flex;" class="searchDialog-input">
            <el-form-item label="企业编码：" prop="enterpriseCode">
              <el-input
                style="width:400px;"
                v-model="businessLicenseInfo.enterpriseCode"
                auto-complete="off"
                type="text"
                placeholder="企业编码"
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
            <el-form-item label="企业注册资金：" prop="enterpriseRegisteredCapital">
              <el-input
                style="width:400px;"
                v-model="businessLicenseInfo.enterpriseRegisteredCapital"
                auto-complete="off"
                type="text"
                placeholder="企业注册资金"
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
          </el-row>
          <el-row style="display:flex;" class="searchDialog-input">
            <el-form-item label="邮政编码：" prop="postalCode">
              <el-input
                style="width:400px;"
                v-model="businessLicenseInfo.postalCode"
                auto-complete="off"
                type="text"
                placeholder="邮政编码"
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
            <el-form-item label="注册地址：" prop="registeredAddress">
              <!-- <el-cascader v-model="dataForm.value" style="width:400px;" :options="options"></el-cascader> -->
              <el-input
                style="width:400px;"
                v-model="businessLicenseInfo.registeredAddress"
                auto-complete="off"
                type="text"
                placeholder="注册地址"
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
          </el-row>
          <el-row style="display:flex;" class="searchDialog-input">
            <el-form-item label="证件有效时间：" prop="credentialsStartingTimeStr">
              <el-date-picker
                style="width:400px;"
                v-model="businessLicenseInfo.credentialsStartingTimeStr"
                type="daterange"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                :disabled="isView == '1'"
              ></el-date-picker>
            </el-form-item>
            <el-form-item label="执照有效时间：" prop="licenseStartingTimeStr">
              <el-date-picker
                style="width:400px;"
                v-model="businessLicenseInfo.licenseStartingTimeStr"
                type="daterange"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                :disabled="isView == '1'"
              ></el-date-picker>
            </el-form-item>
          </el-row>
          <el-row style="display:flex;" class="searchDialog-input">
            <el-form-item label="详细地址：" prop="address">
              <el-input
                style="width:400px;"
                v-model="businessLicenseInfo.address"
                auto-complete="off"
                type="textarea"
                placeholder="详细地址"
                maxlength="50"
                show-word-limit
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
            <el-form-item label="主营品类：" prop="mainCategories">
              <el-input
                style="width:400px;"
                v-model="businessLicenseInfo.mainCategories"
                auto-complete="off"
                type="textarea"
                placeholder="主营品类"
                maxlength="50"
                show-word-limit
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
          </el-row>
          <el-row style="display:flex;" class="searchDialog-input">
            <el-form-item label="营业执照附件：" prop="businessLicenseAttachment">
              <el-upload
                style="width:400px;"
                class="avatar-uploader"
                :action="imgUpload"
                :show-file-list="false"
                :on-success="handleAvatarSuccess"
                :before-upload="beforeAvatarUpload"
                :disabled="isView == '1'"
              >
                <img
                  v-if="businessLicenseInfo.businessLicenseAttachment"
                  :src="businessLicenseInfo.businessLicenseAttachment"
                  class="avatar"
                />
                <i v-else class="el-icon-plus avatar-uploader-icon"></i>
              </el-upload>
            </el-form-item>
            <el-form-item label="法定代表人证件正面（国徽面）：" prop="legalRepresentativePositive">
              <el-upload
                style="width:400px;"
                class="avatar-uploader"
                :action="imgUpload"
                :show-file-list="false"
                :on-success="handleAvatarSuccessCard"
                :before-upload="beforeAvatarUploadCard"
                :disabled="isView == '1'"
              >
                <img
                  v-if="businessLicenseInfo.legalRepresentativePositive"
                  :src="businessLicenseInfo.legalRepresentativePositive"
                  class="avatar"
                />
                <i v-else class="el-icon-plus avatar-uploader-icon"></i>
              </el-upload>
            </el-form-item>
          </el-row>
          <el-row style="display:flex;" class="searchDialog-input">
            <el-form-item label="法定代表人证件反面（头像面）：" prop="legalRepresentativeObverse">
              <el-upload
                style="width:400px;"
                class="avatar-uploader"
                :action="imgUpload"
                :show-file-list="false"
                :on-success="handleAvatarSuccessCardTwo"
                :before-upload="beforeAvatarUploadCardTwo"
                :disabled="isView == '1'"
              >
                <img
                  v-if="businessLicenseInfo.legalRepresentativeObverse"
                  :src="businessLicenseInfo.legalRepresentativeObverse"
                  class="avatar"
                />
                <i v-else class="el-icon-plus avatar-uploader-icon"></i>
              </el-upload>
            </el-form-item>
          </el-row>
        </el-tab-pane>
        <!-- <el-tab-pane label="资质证照信息"></el-tab-pane> -->
        <el-tab-pane label="财务信息">
          <div style="font-size: 17px;color: #808080;font-weight: 700;">税务信息</div>
          <el-row style="display:flex;" class="searchDialog-input">
            <el-form-item label="企业纳税人类型：" prop="corporateTaxpayerType">
              <el-select
                v-model="financialInformationInfo.corporateTaxpayerType"
                placeholder="请选择企业纳税人类型"
                style="width:400px;"
                auto-complete="off"
                :disabled="isView == '1'"
              >
                <el-option label="一般纳税人" value="1"></el-option>
                <el-option label="小规模纳税人" value="2"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="企业纳税税率：" prop="corporateTaxRate">
              <el-input
                style="width:400px;"
                v-model="financialInformationInfo.corporateTaxRate"
                auto-complete="off"
                type="text"
                placeholder="企业纳税税率"
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
          </el-row>
          <div style="font-size: 17px;color: #808080;font-weight: 700;">收款信息</div>
          <el-row style="display:flex;" class="searchDialog-input">
            <el-form-item label="报价方式：" prop="quotations">
              <el-select
                v-model="financialInformationInfo.quotations"
                placeholder="请选择报价方式"
                style="width:400px;"
                auto-complete="off"
                :disabled="isView == '1'"
              >
                <el-option label="含税" value="1"></el-option>
                <el-option label="不含税" value="2"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="收款人姓名：" prop="payeeName">
              <el-input
                style="width:400px;"
                v-model="financialInformationInfo.payeeName"
                auto-complete="off"
                type="text"
                placeholder="收款人姓名"
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
          </el-row>
          <el-row style="display:flex;" class="searchDialog-input">
            <el-form-item label="账户类型：" prop="accountType">
              <el-select
                v-model="financialInformationInfo.accountType"
                placeholder="请选择账户类型"
                style="width:400px;"
                auto-complete="off"
                :disabled="isView == '1'"
              >
                <el-option label="支付宝" value="1"></el-option>
                <el-option label="微信" value="2"></el-option>
                <el-option label="网银" value="3"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="收款账号：" prop="collectionAccount">
              <el-input
                style="width:400px;"
                v-model="financialInformationInfo.collectionAccount"
                auto-complete="off"
                type="text"
                placeholder="收款账号"
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
          </el-row>
          <el-row style="display:flex;" class="searchDialog-input">
            <el-form-item label="开户银行：" prop="bankAccount">
              <el-input
                style="width:400px;"
                v-model="financialInformationInfo.bankAccount"
                auto-complete="off"
                type="text"
                placeholder="开户银行"
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
            <el-form-item label="开户银行支行：" prop="bankBranchName">
              <el-input
                style="width:400px;"
                v-model="financialInformationInfo.bankBranchName"
                auto-complete="off"
                type="text"
                placeholder="开户银行支行名称"
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
          </el-row>
          <div style="font-size: 17px;color: #808080;font-weight: 700;">结算信息</div>
          <el-row style="display:flex;" class="searchDialog-input">
            <el-form-item label="收款人手机号：" prop="payeePhone">
              <el-input
                style="width:400px;"
                v-model="financialInformationInfo.payeePhone"
                auto-complete="off"
                type="text"
                placeholder="收款人手机号"
                :disabled="isView == '1'"
              ></el-input>
            </el-form-item>
            <el-form-item label="默认结算地：" prop="defaultSettlement">
              <el-select
                v-model="financialInformationInfo.defaultSettlement"
                placeholder="请选择默认结算地"
                style="width:400px;"
                auto-complete="off"
                :disabled="isView == '1'"
              >
                <el-option label="总部" value="1"></el-option>
                <el-option label="门店" value="2"></el-option>
              </el-select>
            </el-form-item>
          </el-row>
          <el-row style="display:flex;" class="searchDialog-input">
            <el-form-item label="默认付款供应商：" prop="defaultPaymentProvider">
              <el-select
                v-model="financialInformationInfo.defaultPaymentProvider"
                placeholder="请选择默认付款供应商"
                style="width:400px;"
                auto-complete="off"
                @change="defaultSupplierChange"
                :disabled="isView == '1'"
              >
                <el-option label="自己" value="1"></el-option>
                <el-option label="其他" value="2"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item
              label="选择付款供应商："
              prop="description"
              v-if="financialInformationInfo.defaultPaymentProvider == '2'"
            >
              <el-select
                v-model="financialInformationInfo.defaultPaymentId"
                filterable
                remote
                reserve-keyword
                placeholder="请输入供应商名称"
                :remote-method="remoteMethod"
                :loading="loading"
                :disabled="isView == '1'"
              >
                <el-option
                  v-for="item in options"
                  :key="item.id"
                  :label="item.supplierName"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-row>
          <el-row style="display:flex;">
            <el-form-item label="默认送货供应商：" prop="defaultDeliverySupplier">
              <el-select
                v-model="financialInformationInfo.defaultDeliverySupplier"
                placeholder="请选择默认送货供应商"
                style="width:400px;"
                auto-complete="off"
                @change="defaultSupplierChange"
                :disabled="isView == '1'"
              >
                <el-option label="自己" value="1"></el-option>
                <el-option label="其他" value="2"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item
              label="选择送货供应商"
              prop="description"
              v-if="financialInformationInfo.defaultDeliverySupplier == '2'"
            >
              <el-select
                v-model="financialInformationInfo.defaultDeliveryId"
                filterable
                remote
                reserve-keyword
                placeholder="请输入供应商名称"
                :remote-method="remoteMethod"
                :loading="loading"
                :disabled="isView == '1'"
              >
                <el-option
                  v-for="item in options"
                  :key="item.id"
                  :label="item.supplierName"
                  :value="item.id"
                ></el-option>
              </el-select>
            </el-form-item>
          </el-row>
        </el-tab-pane>
        <el-tab-pane label="联系人信息">
          <el-row class="tr">
            <el-button type="primary" @click="add" v-if="isView != 1" class="button">增加</el-button>
          </el-row>
          <personComponent
            :editDialogVisible="editDialogVisibleLianxiren"
            :supplierId="supplierId"
            @add="add"
            :isView="isView"
          ></personComponent>
        </el-tab-pane>
        <el-tab-pane label="附件信息">
          <el-row class="tr">
            <el-button type="primary" @click="enclosureAdd" v-if="isView != 1" class="button">上传</el-button>
          </el-row>
          <annexComponent :supplierId="supplierId" :isView="isView" @enclosureAdd="enclosureAdd" :editDialogVisible="editDialogVisiblefujian"></annexComponent>
        </el-tab-pane>
        <el-tab-pane label="发货地址信息">
          <el-row class="searchDialog-input">
            <el-form-item label="发货地址：" prop="limits">
              <el-cascader v-model="shipAddress.value" :disabled="isView == '1'" style="width:400px;" :options="cascader"></el-cascader>
            </el-form-item>
            <el-form-item label="详细地址：" prop="limits">
              <el-input v-model="shipAddress.address" :disabled="isView == '1'" placeholder="详细地址" type="textarea"></el-input>
            </el-form-item>
          </el-row>
        </el-tab-pane>
        <el-tab-pane label="操作日志">
          <logComponent></logComponent>
        </el-tab-pane>
      </el-tabs>
      <div style="text-align: center;margin-top: 2%;">
        <el-button type="success" plain style="width:90px" v-if="isView != 1" @click="submit()">保存</el-button>
        <el-button type="danger" plain style="width:90px" @click="cancel">取消</el-button>
      </div>
    </el-form>
  </div>
</template>

<script>
import { hasPermission } from "@/permission/index.js";
import citys from "../../../../static/json/Paje/citys";
import CyTable from "@/views/Core/CyTable";
import KtButton from "@/views/Core/KtButton";
import TableColumnFilterDialog from "@/views/Core/TableColumnFilterDialog";
import personComponent from "@/views/Pages/Procurement/ProviderComponent/PersonComponent";
import annexComponent from "@/views/Pages/Procurement/ProviderComponent/AnnexComponent";
import logComponent from "@/views/Pages/Procurement/ProviderComponent/LogComponent";

export default {
  components: {
    CyTable,
    KtButton,
    TableColumnFilterDialog,
    personComponent,
    annexComponent,
    logComponent,
  },
  props: {
    perms: {
      // 按钮权限标识，外部使用者传入
      type: String,
      default: null,
    },
    show: {
      // 按钮是否展示
      type: Boolean,
      default: true,
    },
  },
  data() {
    return {
      editDialogVisibleLianxiren: false,
      editDialogVisiblefujian: false,
      value: [],
      options: [],
      cascader:citys,
      size: "small",
      tabPosition: "top",
      dataForm: {
        id: null,
        merchantName: null,
        supplierName: null,
        supplierAbbreviation: null,
        supplierMnemonicCode: null,
        supplierGlnCode: null,
        enterpriseType: "1",
        companyEmail: null,
        companyWebsite: null,
        contactNumber: null,
        faxNumber: null,
        enterpriseBrandName: null,
        internalSupplier: null,
        transactionCurrency: "1",
        purchasingMethod: "0",
        cooperationMethod: "1",
        remarks: null,
        status: "1",
      },
      businessLicenseInfo: {
        id: null,
        supplierId: null,
        companyName: null,
        corporateTaxNumber: null,
        legalRepresentative: null,
        businessLicenseNumber: null,
        enterpriseCode: null,
        enterpriseRegisteredCapital: null,
        postalCode: null,
        registeredAddress: null,
        address: null,
        credentialsStartingTimeStr: null,
        credentialsStartingTime: null,
        credentialsEndTime: null,
        licenseStartingTimeStr: null,
        licenseStartingTime: null,
        licenseEndTime: null,
        mainCategories: null,
        businessLicenseAttachment: null,
        legalRepresentativePositive: null,
        legalRepresentativeObverse: null,
      },
      financialInformationInfo: {
        id: null,
        supplierId: null,
        corporateTaxpayerType: "1",
        corporateTaxRate: null,
        quotations: "1",
        payeeName: null,
        accountType: "1",
        collectionAccount: null,
        bankAccount: null,
        bankBranchName: null,
        payeePhone: null,
        defaultSettlement: "1",
        defaultPaymentProvider: "1",
        defaultDeliverySupplier: "1",
        defaultPaymentName: null,
        defaultPaymentId: null,
        defaultDeliveryId: null,
        defaultDeliveryName: null,
      },
      shipAddress:{
        value:[],
        address:null,
        contactsProvinceId:null,
        contactsCityId:null,
        contactsCountryId:null
      },
      imgUpload: this.utils.imgUploadUrl,
      dataFormRules: {
        supplierName: [
          { required: true, message: "请输入供应商名称", trigger: "blur" },
          { required: true, message: "请输入供应商名称", trigger: "change" },
        ],
        transactionCurrency: [
          { required: true, message: "请选择交易币别", trigger: "change" },
        ],
        cooperationMethod: [
          { required: true, message: "请选择合作方式", trigger: "change" },
        ],
      },
      editDialogVisible: false, // 新增编辑界面是否显示
      flag: "",
      supplierId: this.$route.query.id,
      isView:this.$route.query.isView || "2",
      supplierInfo: {},
      supplierList: [], //默认供应商集合
      loading:false,
    };
  },
  methods: {
    handleClick: function () {
      // 按钮操作处理函数
      this.$emit("click", {});
    },
    hasPerms: function (perms) {
      if (this.show == false) {
        return this.show;
      }
      // 根据权限标识和外部指示状态进行权限判断
      return hasPermission(perms);
    },
    cancel: function () {
      this.$router.push({
        path: "/pages/Procurement/ProviderManage"
      });
    },
    handleAvatarSuccess(res, file) {
      this.businessLicenseInfo.businessLicenseAttachment =
        file.response.data.imgUrl;
    },
    beforeAvatarUpload(file) {
      const isJPG = file.type === "image/jpeg";
      const isLt2M = file.size / 1024 / 1024 < 2;
      if (!isLt2M) {
        this.$message.error("上传头像图片大小不能超过 2MB!");
      }
      return isLt2M;
    },
    handleAvatarSuccessCard(res, file) {
      this.businessLicenseInfo.legalRepresentativePositive =
        file.response.data.imgUrl;
    },
    beforeAvatarUploadCard(file) {
      const isJPG = file.type === "image/jpeg";
      const isLt2M = file.size / 1024 / 1024 < 2;
      if (!isLt2M) {
        this.$message.error("上传头像图片大小不能超过 2MB!");
      }
      return isLt2M;
    },
    handleAvatarSuccessCardTwo(res, file) {
      this.businessLicenseInfo.legalRepresentativeObverse =
        file.response.data.imgUrl;
    },
    beforeAvatarUploadCardTwo(file) {
      const isJPG = file.type === "image/jpeg";
      const isLt2M = file.size / 1024 / 1024 < 2;
      if (!isLt2M) {
        this.$message.error("上传头像图片大小不能超过 2MB!");
      }
      return isLt2M;
    },
    //供应商联系人添加按钮
    add() {
      this.editDialogVisibleLianxiren = !this.editDialogVisibleLianxiren;
    },
    //供应商附件增加按钮
    enclosureAdd(){
      this.editDialogVisiblefujian = !this.editDialogVisiblefujian;
    },
    //查询供应商基本信息
    querySupplierInfo() {
      let that = this;
      that.utils.request.querySupplierInfo({ id: this.supplierId }, (res) => {
        if (res.code == "0000" && res.data) {
          that.supplierInfo = res.data;
          that.$set(that.dataForm,"merchantName",that.supplierInfo.merchantName);
          that.$set(that.dataForm,"supplierName",that.supplierInfo.supplierName);
          that.$set(that.dataForm,"supplierAbbreviation",that.supplierInfo.supplierAbbreviation);
          that.$set(that.dataForm,"supplierMnemonicCode",that.supplierInfo.supplierMnemonicCode);
          that.$set(that.dataForm,"supplierGlnCode",that.supplierInfo.supplierGlnCode);
          that.$set(that.dataForm,"companyEmail",that.supplierInfo.companyEmail);
          that.$set(that.dataForm,"companyWebsite",that.supplierInfo.companyWebsite);
          that.$set(that.dataForm,"contactNumber",that.supplierInfo.contactNumber);
          that.$set(that.dataForm, "faxNumber", that.supplierInfo.faxNumber);
          that.$set(that.dataForm,"enterpriseBrandName", that.supplierInfo.enterpriseBrandName);
          that.$set(that.dataForm,"internalSupplier", that.supplierInfo.internalSupplier);
          that.$set(that.dataForm,"remarks", that.supplierInfo.remarks);
          that.$set(that.dataForm,"status", that.supplierInfo.status + '');
          that.$set(that.dataForm,"enterpriseType", that.supplierInfo.enterpriseType + "");
          that.$set(that.dataForm,"transactionCurrency", that.supplierInfo.transactionCurrency + "");
          that.$set(that.dataForm,"purchasingMethod", that.supplierInfo.purchasingMethod + "");
          that.$set(that.dataForm,"cooperationMethod", that.supplierInfo.cooperationMethod + "");
          //更新营业执照信息
          if (res.data.businessLicenseInfo) {
            that.businessLicenseInfo = that.supplierInfo.businessLicenseInfo;
          }
          //更新财务信息
          if (res.data.financialInformationInfo) {
            that.financialInformationInfo =
              that.supplierInfo.financialInformationInfo;
            if(that.financialInformationInfo.defaultDeliveryId != 0 || that.financialInformationInfo.defaultPaymentId != 0){
              that.querySupplierList();
            }
            if(that.financialInformationInfo.defaultDeliveryId == 0){
              that.financialInformationInfo.defaultDeliveryId = null;
            }
            if(that.financialInformationInfo.defaultPaymentId == 0){
              that.financialInformationInfo.defaultPaymentId = null;
            }
            
            that.$set(that.financialInformationInfo,"accountType",that.financialInformationInfo.accountType + '');
            that.$set(that.financialInformationInfo,"corporateTaxpayerType",that.financialInformationInfo.corporateTaxpayerType + '');
            that.$set(that.financialInformationInfo,"quotations",that.financialInformationInfo.quotations + '');
            that.$set(that.financialInformationInfo,"defaultSettlement",that.financialInformationInfo.defaultSettlement + '');
            that.$set(that.financialInformationInfo,"defaultPaymentProvider",that.financialInformationInfo.defaultPaymentProvider + '');
            that.$set(that.financialInformationInfo,"defaultDeliverySupplier",that.financialInformationInfo.defaultDeliverySupplier + '');
          }
          //更新发货地址信息
          if(res.data.shipAddress){
            that.shipAddress = that.supplierInfo.shipAddress;
            if(that.shipAddress.contactsProvinceId && that.shipAddress.contactsCityId && that.shipAddress.contactsCountryId){
              that.shipAddress.value = [that.shipAddress.contactsProvinceId + '',that.shipAddress.contactsCityId + '',that.shipAddress.contactsCountryId + ''];
            }
          }
        }
      });
    },
    //提交
    submit() {
      this.$refs["dataForm"].validate((valid) => {
        if (valid) {
          let param = this.dataForm;
          param.id = this.supplierId;
          //封装供应商营业执照信息
          if (this.businessLicenseInfo) {
            if (this.businessLicenseInfo.credentialsStartingTimeStr) {
              this.businessLicenseInfo.credentialsStartingTime = this.businessLicenseInfo.credentialsStartingTimeStr[0];
              this.businessLicenseInfo.credentialsEndTime = this.businessLicenseInfo.credentialsStartingTimeStr[1];
            }
            if (this.businessLicenseInfo.licenseStartingTimeStr) {
              this.businessLicenseInfo.licenseStartingTime = this.businessLicenseInfo.licenseStartingTimeStr[0];
              this.businessLicenseInfo.licenseEndTime = this.businessLicenseInfo.licenseStartingTimeStr[1];
            }
            this.businessLicenseInfo.supplierId = this.supplierId;
            param.businessLicenseInfo = this.businessLicenseInfo;
          }
          //封装供应商财务信息
          if(this.financialInformationInfo){
            this.financialInformationInfo.supplierId = this.supplierId;
            param.financialInformationInfo = this.financialInformationInfo;
          }
          //封装供应商发货地址信息
          if(this.shipAddress){
            if(this.shipAddress.value && this.shipAddress.value.length > 0){
              this.shipAddress.contactsProvinceId = this.shipAddress.value[0];
              this.shipAddress.contactsCityId = this.shipAddress.value[1];
              this.shipAddress.contactsCountryId = this.shipAddress.value[2];
            }
            this.shipAddress.supplierId = this.supplierId;
            param.shipAddress = this.shipAddress;
          }

          this.utils.request.saveOrUpdateSupplierInfo(param,res =>{
            if(res.code == '0000'){
              this.querySupplierInfo();
              this.$message({message: "操作成功", type: "success"});
              this.cancel();
            }
          });
        }
      });
    },
    //查询付款、送货供应商列表
    querySupplierList() {
      let params = {
        excludeId: this.supplierId,
      };
      let that = this;
      that.loading = true;
      that.utils.request.supplierInformationList(params, (res) => {
        if (res.code == "0000" && res.data) {
          that.loading = false;
          that.supplierList = res.data;
          that.options = that.supplierList;
        } else {
          that.supplierList = [];
        }
      });
    },
    //默认付款、送货供应商下拉选中事件
    defaultSupplierChange(event) {
      if (event == "2") {
        this.querySupplierList();
      }
    },
    //财务信息选择供应商
    remoteMethod(query) {
      if (query !== "") {
        this.loading = true;
        setTimeout(() => {
          this.loading = false;
          this.options = this.supplierList.filter((item) => {
            return item.supplierName.toLowerCase().indexOf(query.toLowerCase()) > -1;
          });
        }, 200);
      } else {
        this.options = this.supplierList;
      }
    },
  },
  mounted() {
    if (this.supplierId) {
      this.querySupplierInfo();
    }
  },
};
</script>

<style scoped lang='scss'>
.avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.el-icon-plus {
  border: 1px dashed #d9d9d9;
}
.avatar-uploader .el-upload:hover {
  border-color: #2f4554;
}
.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  line-height: 178px;
  text-align: center;
}
.avatar {
  width: 178px;
  height: 178px;
  display: block;
}
.dis input {
  background-color: #f5f7fa;
}
.selectshangjia {
  width: 400px;
  height: 32px;
  line-height: 32px;
  -webkit-appearance: none;
  background-color: #fff;
  background-image: none;
  border-radius: 4px;
  border: 1px solid #dcdfe6;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #606266;
  display: inline-block;
  font-size: inherit;
  outline: 0;
  padding: 0 15px;
  -webkit-transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
  background-color: #f5f7fa;
  border-color: #e4e7ed;
  color: #c0c4cc;
  cursor: not-allowed;
}
.selectshangjia::-webkit-input-placeholder {
  color: #c0c4cc;
}
.selectshangjia::-moz-input-placeholder {
  color: #c0c4cc;
}
.selectshangjia::-ms-input-placeholder {
  color: #c0c4cc;
}
.tr {
  text-align: right;
  .button {
    margin: 10px 0px 20px 0px;
  }
}
</style>